import React from 'react';
import {
    Row,
    Col,
    Table,
    Form,
    Input
} from 'antd';
import axios from 'axios';
import '../Operation/balance.less';
import infoData from './AllStationInfo.json';
import '../CustomService/OrderInfo/OrderInfo.less'


class Erweima extends React.Component {
    constructor(props) {
        super(props);
        const user = JSON.parse(sessionStorage.getItem("user"));
        this.state = {
            dataSource: [],
            loading: true,
            keyword: '',
            user: user,
            isEnable: true
        };
    };

    stationInfoList() {
        let data = infoData.RECORDS;
        let len = infoData.RECORDS.length;
        try {
            while (len--) {
                if (data[len].interfaceUrl == "" || data[len].globalcode == '410001' || data[len].globalcode == '410002' || data[len].globalcode == '410003' || data[len].globalcode == '140501' || data[len].globalcode == '410304') {
                    data.splice(len, 1);
                }
            };
            let i = data.length;
            while (i--) {
                data[i].index = i + 1;
            }

        } catch (err) {
            console.log(err)
        }
        return data
    }

    componentDidMount() {
        this.setState({ loading: false, dataSource: this.stationInfoList() });
    };

    search(value) {
        this.setState({ keyword: value });
        let data = this.stationInfoList();
        let len = data.length;
        let select = [];
        if (value) {
            while (len--) {
                if (data[len].shortname.indexOf(value) >= 0) {
                    select.push(data[len])
                }
            };
            this.setState({ dataSource: select });
        } else {
            this.setState({ dataSource: this.stationInfoList() });

        }
    }

    render() {
        const Search = Input.Search;
        const columns = [
            {
                title: '序号',
                width: 80,
                dataIndex: 'index',
            },
            {
                title: '地市',
                dataIndex: 'city',
                width: 100
            }, {
                title: '车站编码',
                dataIndex: 'globalcode',
                width: 80
            }, {
                title: '车站名称',
                dataIndex: 'shortname',
                width: 150
            }, {
                title: '网售状态',
                width: 80,
                dataIndex: 'isAllow',
                render: (text, record) => {
                    return (
                        <span style={{ color: record.isAllow == '0' ? 'red' : 'green' }}>{record.isAllow == '1' ? '售' : '停售'}</span>
                    )
                }
            }, {
                title: '退票支持',
                dataIndex: 'isRefund',
                width: 85,
                render: (text, record) => {
                    return (
                        <span style={{ color: record.isRefund == '0' ? 'red' : 'green' }}>{record.isRefund == '1' ? '支持' : '不支持'}</span>
                    )
                }
            }, {
                title: '取票方式',
                dataIndex: 'printtype',
                width: 150
            }, {
                title: '预售天数',
                dataIndex: 'perioddays',
                width: 80
            }, {
                title: '车站地址',
                dataIndex: 'address',
                width: 200
            }, {
                title: '车站电话',
                dataIndex: 'phones',
                width: 250
            }
        ];
        const className = "components-table-demo-nested";
        const scroll = {
            y: 800
        };
        return (
            <div className="orderinfo">
                <Row gutter={8} style={{
                    marginTop: '20px'
                }}>
                    <Col span={24}>
                        <div
                            style={{
                                margin: 10
                            }}>
                            <Search
                                placeholder="请输入车站名称查询"
                                style={{
                                    width: 600
                                }}
                                onSearch={value => this.search(value)} />

                        </div>
                        <Table
                            style={{
                                fontSize: 30
                            }}
                            className="center"
                            {...this.state}
                            rowKey={record => record.index}
                            bordered={true}
                            className={className}
                            columns={columns}
                            scroll={scroll}
                        />
                    </Col>
                </Row>
            </div>
        )
    }
}
const CErweima = Form.create()(Erweima);
export default CErweima
